<template>
	<view>
		<view class="need_bind_mask" v-if="need_bind_house"></view>
		<view class="need_bind_popup" v-if="need_bind_house">
			<view class="p400">
				<view class="p">
					<lang keywords="您不属于当前社区，是否去绑定社区？"></lang>
				</view>
				<view class="clr button">
					<view class="fl cancel link-url view" @tap="goBindCancle">
						<lang keywords="取消"></lang>
					</view>
					<view class="fr binding view" @tap="goBindGo">
						<lang keywords="去绑定"></lang>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import common from '../../utils/common.js';

	var callbackObj = null;
	var _this;
	var app = getApp();

	export default {
		name: 'villageBindHouse',
		props: {
			options: {
				type: Object,
				default: {}
			},
		},
		data() {
			return {
				need_bind_house: false,
				village_id: 0,
				hasCancleMethod: false
			}
		},
		watch: {
			options: {
				immediate: true,
				handler(new_var) {
					var _this = this;
					var options = new_var
					console.log('67 villageBindHouse', options)
					if (!options) return;
					for (var i in options) {
						this[i] = options[i]
					}
				}
			}
		},
		created() {
			_this = this;
		},
		methods: {
			goBindCancle: function(e) {
				if (this.bindHasCancleMethod) {
					this.$emit('cancleBindHouse', {});
				} else {
					if (common.checkIsFooterPage("/pages/village_menu/index")) {
						wx.switchTab({
							url: "/pages/village_menu/index"
						});
					} else {
						wx.redirectTo({
							url: '/pages/village_menu/index',
						})
					}
				}
			},
			goBindGo: function(e) {
				uni.navigateTo({
					url: "/pages/village/my/selectRooms?village_id=" + this.village_id
				});
			}
		}
	}
</script>
<style>
	.need_bind_mask {
		position: fixed;
		left: 0px;
		width: 100%;
		height: 100%;
		top: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.7);
		z-index: 888;
	}

	.need_bind_popup {
		position: fixed;
		width: 84%;
		margin: 0 8%;
		margin-top: -357rpx;
		top: 50%;
		left: 0px;
		background: url(https://hf.pigcms.com/tpl/Wap/pure/static/village_list/images/yztc.png) center top no-repeat;
		background-size: 100% 468rpx;
		z-index: 999;
	}

	.need_bind_popup .p400 {
		margin-top: 468rpx;
		background: #fff;
		padding: 0 30rpx 30rpx 30rpx;
		border-radius: 0px 0px 3rpx 3rpx;
	}

	.need_bind_popup .p400 .p {
		font-size: 32rpx;
		color: #666666;
		line-height: 32rpx;
		padding: 38rpx 0 38rpx 0;
		text-align: justify;
	}

	.fl {
		float: left;
		display: inline;
	}

	.fr {
		float: right;
		display: inline;
	}

	.need_bind_popup .p400 .button .view {
		width: 45%;
		text-align: center;
		line-height: 80rpx;
		font-size: 32rpx;
		border-radius: 8rpx;
	}

	.need_bind_popup .p400 .button .view.cancel {
		color: #999999;
		border: #c9c9c7 1px solid;
		background: #f6f7f2;
	}

	.need_bind_popup .p400 .button .view.binding {
		color: #fff;
		border: #00d674 1px solid;
		background: #00d674;
	}

	.clr {
		zoom: 1;
	}

	.clr:after {
		visibility: hidden;
		display: block;
		content: " ";
		clear: both;
		height: 0;
		line-height: 0;
	}
</style>
